/**
 * form混合
 * */
import { mapState } from 'vuex'
import { ApiRequest } from '@api/basePage'

export default {
    data () {
        return {
            dynamicData: {}, // 配置的数据
            pagePath: '',
            grid: {
                xl: 8,
                lg: 8,
                md: 12,
                sm: 24,
                xs: 24
            },
            collapse: false, // 是否展开更多筛选条件
            formData: {}, // 表单提交数据
            copyFormData: {}, // copy form data 此处必须写
            copyFormDataRules: {}, // copy form rules 此处必须写
            requestApi: {}, // 页面所需接口集合
            uuid: '', // 唯一标识 访问页面必传
            sLoading: false
        }
    },
    computed: {
        ...mapState('admin/layout', ['isMobile']),
        ...mapState('admin/user', ['info']),
        labelWidth () {
            return this.isMobile ? undefined : 120
        },
        labelPosition () {
            return this.isMobile ? 'top' : 'right'
        }
    },
    created () {
        this.getConfigData()
    },
    methods: {
        // 组件内数据改变
        handleChangeFormData (data) {
            this.$set(this.$data, 'formData', data)
        },
        // 提交
        handleSubmit (name) {
            this.$refs[name].validate(valid => {
                if (valid) {
                    if (this.sLoading) {
                        return false
                    }
                    this.sLoading = true;
                    let data = this.formData
                    // 开始请求会员信息
                    ApiRequest(
                        this.requestApi.addDataInfo.url,
                        this.requestApi.addDataInfo.type,
                        data
                    ).then(res => {
                        if (res.retStatus === '1') {
                            if (res.retMessage) {
                                this.$Message.success(res.retMessage)
                            } else {
                                this.$Message.success('操作成功!')
                            }
                            this.$router.go(-1)
                        }
                        this.sLoading = false;
                    })
                } else {
                    this.$Message.error('请完善信息!')
                }
            })
        },
        // 清空表单
        handleReset (name) {
            this.$refs[name].resetFields()
            this.getConfigData()
        },
        // 获取初始配置信息
        getConfigData () {
            this.pagePath = this.$route.path
            let addConfig = require('@/configFile/product/baseAdd/index')
            let dynamicData = addConfig.default[this.pagePath]
            this.requestApi = dynamicData.requestApi // 页面所需接口集合
            this.$set(this.$data, 'dynamicData', dynamicData)

            // copy 一份数据 方便清空表单数据
            let copyFormData = JSON.parse(JSON.stringify(this.dynamicData.formData))
            let copyFormDataRules = JSON.parse(
                JSON.stringify(this.dynamicData.formDataRules)
            )
            // 传给子组件的数据
            this.copyFormData = copyFormData
            this.copyFormDataRules = copyFormDataRules

            // 动态添加formData 提交数据内容
            copyFormData.forEach(item => {
                const obj = item.data
                let name = ''
                let val = ''
                if (obj.type === 'inputRange' || obj.type === 'inputNumberRange') {
                    obj.valueArr.forEach(item => {
                        name = item.name
                        val = item.value
                        this.$set(this.formData, name, val)
                    })
                } else {
                    name = obj.name
                    val = obj.value
                    this.$set(this.formData, name, val)
                }
            })
        }
    },
    watch: {
        $route: 'getConfigData'
    }
}
